<script>
import {EvevtBus} from "@/utils/EvevtBus";
import {getmodel, query} from "@/api/docMG";
import Request from "@/api/request";
import restore from "echarts/src/component/toolbox/feature/Restore";

export default {
  name: "RecycledList",
  props: {
    doc_status: String,
  },
  data() {
    return {
      view_order: "time:asc",
      page: 1,
      total: 1,
      data: [],
      size: 10,
      multipleSelection: []
    }
  },
  watch: {
    doc_status: function (val) {
      this.doc_status = val
      this.query()
    }
  },
  mounted() {
    EvevtBus.$on('data', (data) => {
      this.data = data
    })
    if (this.$route.params.data !== undefined) {
      this.data = this.$route.params.data
    } else {
      this.query()
    }
  },
  methods: {
    restore(row) {
      Request.post(`/recycle/restore?id=${row.id}`).then(res => {
        if (res.code === 1) {
          this.$message.success(res.message)
          getmodel()
        } else this.$message.error(res.message)
      })
      setTimeout(() => this.query(), 500)
    },
    query() {
      query(this.page, this.size, this.doc_status, "recycled", this.view_order).then(res => {
        this.data = res.data.docs.records
        console.log(res)
        this.total = res.data.docs.total
      })
    },
    remove(row) {

      Request.post(`/recycle/expunge?id=${row.id}`).then(res => {
        if (res.code === 1) {
          this.$message.success(res.message)
        } else this.$message.error(res.message)
      })
      setTimeout(() => this.query(), 500)
    },
    handleCurrentChange(val) {
      this.page = val
      this.query()
    },
    download(row) {
      console.log(row)
    },

    handleSelectionChange(val) {
      this.multipleSelection = val;
      EvevtBus.$emit('multipleSelection', val)
    }
  }
}
</script>

<template>

  <div id="file-list-content">
    <div class="achievement">
      <el-table
          :data="data"
          @selection-change="handleSelectionChange">
        <!--        <el-table-column-->
        <!--            type="selection"-->
        <!--            align="center"-->
        <!--            width="45">-->
        <!--        </el-table-column>-->
        <el-table-column
            align="center"
            prop="title"
            label="文件名称">
        </el-table-column>
        <el-table-column
            align="center"
            width="454"
            prop="title"
            label="文件类型">
        </el-table-column>
        <el-table-column
            align="center"
            label="操作">
          <template slot-scope="scope">
            <el-link :underline="false" @click.native="restore(scope.row)">恢复</el-link>
            <el-link :underline="false" @click.native="remove(scope.row)">彻底删除</el-link>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
          background
          @current-change="handleCurrentChange"
          :page-size="size"
          layout="prev, pager, next"
          :total=total>
      </el-pagination>
    </div>
  </div>

</template>

<style scoped>
a {
  margin-right: 10px;
}

.batch-delete {
  color: #f56c6c;
}
</style>
